$(() => {
    $(".header-list>ul>li").hover(function () {
        $(this).css("color", "#fff").siblings().css("color", "#999")
    }, function () {
        $(this).css("color", "#999")
    })

    //手机考拉
    $(".sort>li").eq(3).hover(function () {
        $(this).children().css("display", "block")
    }, function () {
        $(this).children().css("display", "none")
    })

    //个人中心
    class Headchang {
        constructor(var1, var2) {
            this.var1 = var1
            this.var2 = var2
        }
        rendom() {
            $(".sort>li").eq(this.var1).hover(function () {
                $(this).children(".header-active").addClass("per-center")
                $(this).children("i").css("transform", " rotate(0deg)")
            }, function () {
                $(".header-active").removeClass("per-center")
                $(this).children("i").css("transform", " rotate(180deg)")
            })
            $(".per-center" + this.var2).children().hover(function () {
                $(this).css("color", "#ff1e32").siblings().css("color", "#999999")
            }, function () {
                $(this).css("color", "#999999")
            })
        }
    }
    let hc1 = new Headchang(6, 1)
    hc1.rendom()
    let hc2 = new Headchang(7, 2)
    hc2.rendom()
    let hc3 = new Headchang(8, 3)
    hc3.rendom()
    let hc4 = new Headchang(9, 4)
    hc4.rendom()
    let hc5 = new Headchang(10, 5)
    hc5.rendom()


    $(".tabTop-right").children().hover(function () {
        console.log($(this))
        $(this).addClass("navTop-color")
    }, function () {
        $(this).removeClass("navTop-color")
    })


    $(".tabTop-nav").hover(function () {
        $(".tabTop-nav-list").css("display", "block")
    }, function () {
        $(".tabTop-nav-list").css("display", "none")
    })
    // $(".tabTop-nav-list").hover(function(){
    //     $(".tabTop-nav-list").css("display", "block")

    // },function () {
    //     $(".tabTop-nav-list").css("display", "none")
    //   })

    new Promise(function (resolve, reject) {
        $.ajax({
            type: "get",
            url: "../server/content_no.php",
            dataType: "json",
            success: (data) => {
                renderUI(data)
                resolve();
            }
        });
    }).then(function () {
        
            console.log($(".nav>li").eq(0))
            $(".nav>li").eq(0).hover(function(){
                console.log($(this))
                $(this).css("display","block")
            },function(){
                $(this).css("display","none")
            })

            /* */
            $(".tabTop-nav-list li").mouseenter(function(){
                $(this).children(".czm").addClass("block")
            })
            $(".tabTop-nav-list li").mouseleave(function(){
                $(this).children(".czm").removeClass("block")
            })
            
    })
    // 渲染content-hot
    function renderUI(data) {
        let html = data.map((ele) => {
            let listhtml = ""
            let str = "";
            let thirdhtml = ele.h3_main.map((item) => {
                let threehtml = item.tree.map((lel) => {
                    return `<li>${lel}</li>`
                }).join("")
                str += `<div class="third-nav"><ul>${threehtml}</ul></div>`
                return str
            }).join("")
            listhtml += `<li><i></i><p>${ele.h2}</p><div class="czm">${thirdhtml}</div></li>`
            return listhtml
        }).join("")
        $(".nav").html(html)
    }
})